import React from 'react';
import {
    FlatList,
    View,
    Text,
    Image,
    TouchableOpacity
} from 'react-native';
import styles from './style/app';
import BrowseItem from './BrowseItem';
import {uniqueArray} from '../../public/widget/Util'
import NavigationUtil from "../../navigator/NavigationUtil";
import DataStore,{BaseUrl} from '../../public/dao/DataStore';
import BackPressComponent from '../../components/BackPressComponent';
export default class Browse extends React.Component {
    constructor(props){
        super(props);
        this.backPress = new BackPressComponent({backPress: () => this.onBackPress()});
        this.state = {
            browseList:[],
            browseNullList:[],
        }
    }
    componentDidMount(){
        this.backPress.componentDidMount();//监听返回键
        let dataStore = new DataStore();
        let params = {};
        dataStore.fetchLocalData('USERDATAS').then((json)=>{//查看本地存储
            if(json.data){
                params.mobile = json.data.mobile
                dataStore.fetchData('/webservice/browse',params,'GET','',true,true).then((json)=>{
                    this.setState({
                        browseList:uniqueArray(json.data.data,'name'),
                    })
                }).catch((err)=>{
                    console.log(err)
                })
            }
          }).catch((err)=>{
              console.log(err)
          })
        let param = {mobile:'15221205964'} 
        dataStore.fetchData('/webservice/browse',param,'GET','',true,true).then((json)=>{
            this.setState({
                browseNullList:json.data.data,
            })
        }).catch((err)=>{
            console.log(err)
        })
    }
    componentWillUnmount(){
        this.backPress.componentWillUnmount();//移除监听返回键
    }
    onBackPress() {
        NavigationUtil.goBack(this.props.navigation);
        return true;
    }
    
    _renderHeader = ()=>{
        return <View>
        </View>
    }
    render() {
        let { browseList,browseNullList } = this.state;
        return (
            <View style={styles.container}>
                { browseList.length==0 ? <View>
            <Text style={styles.titleText}>---您还没有浏览记录---</Text>
            <Text style={styles.titleProduct}>专属推荐</Text>
            <View style={styles.bigBox}> 
            { browseNullList.map((info,i)=>(
                <TouchableOpacity key={i} onPress={()=>{
                    NavigationUtil.goPage({name:info.name,url:info.url},'MyWebView')
                }}>
                <View style={styles.box}>
                    <Image style={styles.image} resizeMode={"contain"} source={{uri:BaseUrl+'/'+info.image_url}}/>
                    <Text style={styles.textName}>{info.name}</Text>
                </View>
                </TouchableOpacity>
            ))}
            </View>
            </View> :
                <FlatList
                data={browseList}
                renderItem={(info,i)=>(<BrowseItem infoDatas={info} key={i}/>)}
                keyExtractor={(item, index) => {
                    return index.toString()
                }}
                ListHeaderComponent={this._renderHeader}
                />
            }
            </View>
        )
    }
}